<%@page contentType="text/html"%>
<%@page pageEncoding="UTF-8"%>
<%@taglib prefix="s" uri="/struts-tags"%>

<link rel="stylesheet" type="text/css" href="./js/yui/assets/skins/sam/paginator.css" />
<link rel="stylesheet" type="text/css" href="./js/yui/assets/skins/sam/datatable.css" />
<link rel="stylesheet" type="text/css" href="./js/yui/assets/skins/sam/container.css" />
<link rel="stylesheet" type="text/css" href="./js/yui/assets/skins/sam/button.css" />
<link rel="stylesheet" type="text/css" href="./js/yui/calendar/assets/skins/sam/calendar.css" />
<style type="text/css">
<!--
    #divCalendar { display:none; position:absolute; left:10px; top:300px; z-index:1 }
    #cal1Container {
        position: absolute;
        display: none;
    }
    p, #cal1Container {
        margin: 1em;
    }
    #cal1Container {
        z-index: 500;
    }
-->
</style>

<script type="text/javascript" src="./js/yahoo-dom-event.js"></script>
<script type="text/javascript" src="./js/yui/connection/connection-min.js"></script>
<script type="text/javascript" src="./js/yui/json/json-min.js"></script>
<script type="text/javascript" src="./js/element-beta-min.js"></script>
<script type="text/javascript" src="./js/yui/paginator/paginator-min.js"></script>
<script type="text/javascript" src="./js/yui/datasource/datasource-min.js"></script>
<script type="text/javascript" src="./js/yui/datatable/datatable-min.js"></script>
<script type="text/javascript" src="./js/yui/container/container-min.js"></script>
<script type="text/javascript" src="./js/yui/button/button-min.js"></script>
<script type="text/javascript" src="./js/yui/event/event-min.js"></script>
<script type="text/javascript" src="./js/yui/calendar/calendar-min.js"></script>

<script type="text/javascript">
    /*
    YAHOO.example.calendar.cal1 = new YAHOO.widget.Calendar( "cal1", "divCalendar"
                                                           , { title:"Choose a date:", close:true } );
    YAHOO.example.calendar.cal1.render(document.body);
    
    var btnAsOfDate = new YAHOO.widget.Button("btnAsOfDate");
    btnAsOfDate.on("click", function(e) {
        var asOfDate = document.getElementById("asOfDate");
        YAHOO.example.calendar.cal1.select(asOfDate.value);
        YAHOO.example.calendar.cal1.show();
    }, this, true);
    */

YAHOO.util.Event.onDOMReady(function(){
    
    var Dom = YAHOO.util.Dom,
        Event = YAHOO.util.Event,
        cal1,
        over_cal = false,
        cur_field = '';

    var init = function() {
        cal1 = new YAHOO.widget.Calendar("cal1", "cal1Container");
        cal1.cfg.setProperty("MDY_DAY_POSITION", 1);
        cal1.cfg.setProperty("MDY_MONTH_POSITION", 2);
        cal1.cfg.setProperty("MDY_YEAR_POSITION", 3);
        cal1.selectEvent.subscribe(getDate, cal1, true);
        cal1.renderEvent.subscribe(setupListeners, cal1, true);
        
        Event.addListener([<%=session.getAttribute("S_DATE_FIELDS")%>], 'focus', showCal);
        Event.addListener([<%=session.getAttribute("S_DATE_FIELDS")%>], 'blur', hideCal);
        cal1.render();
    }

    var setupListeners = function() {
        Event.addListener('cal1Container', 'mouseover', function() {
            over_cal = true;
        });
        Event.addListener('cal1Container', 'mouseout', function() {
            over_cal = false;
        });
    }
    
    var getDate = function() {
        var calDate = this.getSelectedDates()[0];
        calDate = (calDate.getDate()<10?"0":"") + calDate.getDate()
                + '/' + (calDate.getMonth()<9?"0":"") + (calDate.getMonth()+1)
                + '/' + calDate.getFullYear();
        cur_field.value = calDate;
        over_cal = false;
        hideCal();

        try{
        	cur_field.onchange();
        }catch(e){
        }
    }
    
    var showCal = function(ev) {
        var tar = Event.getTarget(ev);
        cur_field = tar;

        var xy = Dom.getXY(tar),
            date = Dom.get(tar).value;

        if(date){
            //cal1.cfg.setProperty('selected', date);
            //cal1.cfg.setProperty("PAGEDATE", "10/2010");
            cal1.cfg.setProperty("selected", date);
            cal1.cfg.setProperty("PAGEDATE", date.substr(3));
        } else{
            //cal1.cfg.setProperty('selected', '');
            //cal1.cfg.setProperty('pagedate', new Date(), true);
            cal1.cfg.setProperty('PAGEDATE', new Date(), true);
        }
        cal1.render();
        Dom.setStyle('cal1Container', 'display', 'block');
        xy[1] = xy[1] + 20;
        Dom.setXY('cal1Container', xy);
    }

    var hideCal = function() {
        if (!over_cal) {
            Dom.setStyle('cal1Container', 'display', 'none');
        }
    }

    //Event.addListener(window, 'load', init);
    init();

});

</script>

<div id="cal1Container"></div>
